﻿<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <script src="js/jquery_2_1_min.js"></script><!--jquery-->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script><!-- vuejs-->
    <script src="js/FastHttpApi.js"></script>
    <script src="js/Controller.js"></script>
    <title>hello world</title>
</head>
<body>
    <div id="hello">
        <p>
            Enter you name: <input type="text" v-model:value="Data.Name" placeholder="enter you name">
            <button type="button" onclick="Submit()">submit</button>
        </p>
        <p><span>{{Data.Hello}}</span>  <span>{{Data.Time}}</span></p>
    </div>
    <script>
        var helloControl;
        $(document).ready(function () {
            helloControl = new Vue({ el: '#hello', data: { Data: { Name: '', Hello: '', Time: '' } } });
        });
        async function Submit() {
            var result = await HomeHello(helloControl.Data.Name);
            helloControl.Data.Hello = result.Data.Hello;
            helloControl.Data.Time = result.Data.Time;
        }
    </script>
</body>
</html>